<form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
    {:token()}
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Add num')}:</label>
        <div class="col-xs-12 col-sm-4">
            <input id="c-add_num" class="form-control" name="row[add_num]" type="number" value="1" min="1" max="99">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Card type')}:</label>
        <div class="col-xs-12 col-sm-4">
            <div class="radio">
                {foreach name="cardTypeList" item="vo"}
                <label for="row[card_type]-{$key}"><input id="row[card_type]-{$key}" name="row[card_type]" type="radio"
                                                          value="{$key}" {in name="key" value="1" }checked{/in} />
                    {$vo}</label>
                {/foreach}
            </div>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Card value')}:</label>
        <div class="col-xs-12 col-sm-4 row-flex">
            <input id="c-card_value" class="form-control" name="row[card_value]" type="number" value="1" min="1"
                   max="99">
            <span id="unit">个月</span>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Status')}:</label>
        <div class="col-xs-12 col-sm-8">
            <div class="radio">
                {foreach name="statusList" item="vo"}
                <label for="row[status]-{$key}"><input id="row[status]-{$key}" name="row[status]" type="radio"
                                                       value="{$key}" {in name="key" value="normal" }checked{/in} />
                    {$vo}</label>
                {/foreach}
            </div>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">{:__('Remark')}:</label>
        <div class="col-xs-12 col-sm-8">
            <textarea id="c-remark" class="form-control" name="row[remark]"></textarea>
        </div>
    </div>
    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="submit" class="btn btn-primary btn-embossed disabled">{:__('OK')}</button>
        </div>
    </div>
</form>

<style>
    /* 使 span 与 input 同一行 */
    #unit {
        display: inline-block; /* 使 span 为行内块元素 */
        margin-left: 5px; /* 添加一些左边距以分隔 input 和 span */
        vertical-align: middle; /* 垂直对齐 */
        height: 33px;
        line-height: 33px;
        text-align: center;
    }

    /* 调整 input 的宽度，为 span 留出空间 */
    #c-card_value {
        flex: 1;
    }
</style>
